<template>
<view>
<!--index.wxml-->
<view class="container">
	<view class="swiper">
		<swiper indicator-dots="true" autoplay="true" interval="3000" duration="1200">
			<swiper-item v-for="(item, index) in slide" :key="index">
				<image class="nav-icon" mode="aspectFill" :src="item.thumb"></image>
			</swiper-item>
		</swiper>
	</view>
	<view class="nav">
		<block v-for="(item, index) in navs" :key="index">
		<navigator :class="'nav-item ' + ((index + 1) % 3 == 0 ? 'nav-item-no-border' : '')" :url="item.url" hover-class="navigator-hover">
			<image class="nav-icon" :src="item.icon"></image>
			<view class="nav-title">{{item.name}}</view>
		</navigator>
		</block>
	</view>
	
	<view class="commend">
		<block v-for="(item, index) in commend" :key="index">
			<view class="commend-header-title">{{item.name}}</view>
			<view class="commend-column">
				<navigator v-for="(subItem, index2) in item.article" :key="index2" class="commend-item" hover-class="navigator-hover">
					<image class="commend-thumb" :src="subItem.thumb"></image>
					<view class="commend-title">{{subItem.title}}</view>
				</navigator>
			</view>
		</block>
	</view>
</view>
<!--<import src="/we7/pages/templates/footer.wxml"></import>-->
<block data-type="template" data-is="footerWx" data-attr="...tabBar">
  <view v-if="list" class="we7-bottom" :style="'background-color:' + backgroundColor + 'border-color:' + borderStyle">
    <block v-for="(item, index) in list" :key="index">
      <view class="we7-bottom-item" v-if="item.pageUrl == ('/' + thisurl)" hover-class="active">
        <navigator :url="item.pagePath" open-type="redirect" hover-class="active">
          <image :src="item.selectedIconPath" mode="widthFix" class="item-img"></image>
          <view class="item-text" :style="'color: ' + selectedColor + ''">{{item.text}}</view>
        </navigator>
      </view>
      <view class="we7-bottom-item" v-else hover-class="active">
        <navigator :url="item.pagePath" open-type="redirect" hover-class="active">
          <image :src="item.iconPath" mode="widthFix" class="item-img"></image>
          <view class="item-text" :style="'color: ' + color">{{item.text}}</view>
        </navigator>
      </view>
    </block>
  </view>
  <view class="we7-bottom-placeholder"></view>
</block>
</view>
</template>

<script>
//index.js
//获取应用实例
var app = getApp();

export default {
  data() {
    return {
      navs: [],
      slide: [],
      commend: [],
      userInfo: {}
    };
  },

  components: {},
  props: {},
  onLoad: function () {
    var that = this;
    app.globalData.util.footer(that); //初始化导航数据

    app.globalData.util.request({
      'url': 'wxapp/home/nav',
      'cachetime': '30',
      success: function (res) {
        if (!res.data.message.errno) {
          console.log(res.data.message.message);
          that.setData({
            navs: res.data.message.message
          });
        }
      }
    });
    app.globalData.util.request({
      'url': 'wxapp/home/slide',
      'cachetime': '30',
      success: function (res) {
        if (!res.data.message.errno) {
          that.setData({
            slide: res.data.message.message
          });
        }
      }
    });
    app.globalData.util.request({
      url: 'wxapp/home/commend',
      cachetime: '30',
      success: function (res) {
        if (!res.data.message.errno) {
          that.setData({
            commend: res.data.message.message
          });
        }
      }
    });
  },
  methods: {}
};
</script>
<style>
@import "./index.css";
</style>